<div class="module-reset">
    <template v-if="isLoading">
        <div class="m-loading-box">
            <loading></loading>
        </div>
    </template>

    <template v-if="isLoading === false">
    <web-box :title="$t('webBoxPCTitle')" :mobileTit="$t('webBoxTitle')">
        <validator :rules="rules" :parent="_self">
            <form class="m-form-page  m-form-login" name="form" action="javascript:;">
                <div class="col-row fn-flex">
                    <label class="row-title">{{$t('common.email')}}</label>
                    <input type="text"
                           tabindex="1"
                           :placeholder="$t('common.pEmail')"
                           name="email"
                           v-model="form.email"
                           class="input">
                    <div class="ui-tip"></div>
                </div>
                <div class="col-row">
                    <label class="row-title">{{$t('verificationCode')}}</label>
                    <div class="comp-verify-code">
                        <a href="javascript:;">
                            <img :src="imgCodeSrc" @click="changeImgCode()" width="112" height="32" style="border-radius:4px;">
                        </a>
                    </div>
                    <input type="text"
                           tabindex="2"
                           :placeholder="$t('common.pCaptcha')"
                           name="imgCode"
                           maxlength="4"
                           autocomplete="off"
                           v-model="form.imgCode"
                           class="input-left">
                    <div class="ui-tip"></div>
                </div>
                <div class="col-row">
                    <label class="row-title">{{$t('emailConfirmationCode')}}</label>
                    <div class="comp-verify-code">
                        <a href="javascript:;"
                           tabindex="3"
                           v-if="sendingCode===false"
                           class="ui-btn ui-btn--gray ui-btn--block link"
                           @click="sendCode()"
                           :disabled="codeLock === true">
                            {{codeBtnText}}
                        </a>
                        <a href="javascript:;"
                           v-if="sendingCode===true"
                           class="ui-btn ui-btn--gray ui-btn--block link"
                           disabled>
                            {{$t('common.waiting')}}...
                        </a>
                    </div>
                    <input type="text"
                           tabindex="3"
                           :placeholder="$t('common.pVerification')"
                           v-model="form.identifyingCode"
                           name="identifyingCode"
                           maxlength="6"
                           class="input-left">
                    <div class="ui-tip"></div>
                </div>
                <div class="col-row fn-flex">
                    <label class="row-title">{{$t('common.password')}}</label>
                    <input type="password"
                           tabindex="4"
                           :placeholder="$t('common.pPass')"
                           v-model="form.newPwd"
                           @focus="checkLoginPass"
                           @blur="checkLoginPassBlur"
                           name="newPwd"
                           class="input">
                    <div class="ui-tip"></div>
                </div>
                <div class="col-row fn-flex">
                    <label class="row-title">{{$t('common.confirm')}}</label>
                    <input type="password"
                           tabindex="5"
                           :placeholder="$t('common.pRepeatPass')"
                           v-model="form.confirmNewPwd"
                           name="confirmNewPwd"
                           class="input">
                    <div class="ui-tip"></div>
                </div>
                <div class="col-row">
                    <button type="submit"
                            tabindex="6"
                            @click="submit()"
                            v-if="isRequesting === false"
                            class="ui-btn ui-btn--block submit-btn">{{$t('common.confirm')}}</button>
                    <button type="submit"
                            disabled
                            v-if="isRequesting === true"
                            class="ui-btn ui-btn--block submit-btn">{{$t('common.waiting')}}...</button>
                </div>
                <!--<div class="col-row col-row&#45;&#45;tip"></div>-->
            </form>
        </validator>
    </web-box>
    </template>

</div>